<template>
	<view class="box bg-white">

		<view>
			<view class="content-box padding-l-r-30">
				<view class="list-box">
					<text>姓名</text>
					<view class="input-box" >
						<input type="text" v-model="form.name"  placeholder="请填写姓名"> 
					</view>
				</view>
				<view class="list-box">
					<text>请填写联系方式</text>
					<view class="input-box">
						<input type="number" v-model="form.contact" placeholder="请填写看房联系方式">
					</view>
				</view>
				<view class="list-box">
					<text>户型面积</text>
					<view class="input-box">
						<input type="number" v-model="form.acreage" placeholder="请填写户型面积" > 
						<text>m²</text>
					</view>
				</view>
				<view class="list-box">
					<text>户型</text>
					<view class="input-box" >
						<input v-model="form.house_type" placeholder="请填写户型" type="text" > 
					</view>
				</view> 
				<view class="list-box">
					<view class="list-box">
						<text>备注</text>
						<view class="input-box">
							<textarea  v-model="form.remark" placeholder="请输入" />
							<!-- <input type="text" v-model="form.illness" placeholder="请填写现病史"> -->
						</view>
					</view>
				</view>
				
				<view class="list-btn" @click="reservation">
					立即预约
				</view>
			</view> 
			<toastTips ref="toast" @btnClick='linkClick'></toastTips>
		</view>
	</view>
</template>

<script>
	import toastTips from '@/components/toast/index.vue'
	import {decorationSign} from '@/api/elderlySuitable.js'

	export default {
		components: {
			toastTips
		},
		data() {
			return {
				form: {
					name:'',acreage:'',house_type:'',contact:'',remark:''
				}, 
				navBarHeight: 0,
				 
				decoration_id:''
			}
		},
		onLoad(options)  {
			this.decoration_id = options.id
			this.getBarHeight()
		},
		methods: {
			getBarHeight() {
				const systemInfo = uni.getSystemInfoSync();
				// 获取状态栏高度
				const statusBarHeight = systemInfo.statusBarHeight;

				// 微信小程序默认导航栏高度（单位为 px）
				const defaultNavBarHeight = 44;

				// 总体头部导航栏高度（包含状态栏）
				this.navBarHeight = statusBarHeight + defaultNavBarHeight;

			},
			// 

			reservation() {
				if(!this.form.name){
					uni.showToast({
						title: '请填写您的姓名',
						icon: 'none',
						mask: true
					})
					return
				}
				if(!this.form.contact){
					uni.showToast({
						title: '请填写您的联系方式',
						icon: 'none',
						mask: true
					})
					return
				}
				let params = {...this.form}
				params.decoration_id = this.decoration_id
				console.log(params ,this.decoration_id);
				decorationSign(params).then(res=>{
					if(res.code == 1){
						this.$refs.toast.getInfo(true, ['您的预约申请已提交，请','注意接听电话'], '我知道了',   )
					}else{
						uni.showToast({
							icon:'none',
							title:res.msg
						})
					}
				})
				
			},
			calendarConfirm(e) {
				console.log(e[0]);
				this.form.date = e[0]
				this.calendarShow = false
			},
			linkClick() {
				console.log(5);
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.list-box {
		text {
			font-size: 28rpx;
			color: #000;
			line-height: 90rpx;
		}
	}

	.input-box {
		display: flex;
		align-items: center;
		padding: 0 20rpx;
		background: #FFFFFF;
		border-radius: 14rpx;
		border: 1px solid #DBDBDB;

		input {
			flex: 1;
			height: 90rpx;
		}

		textarea {
			flex: 1;
			padding: 20rpx;
		}

		image {
			width: 30rpx;
		}
	}

	.list-btn {
		height: 90rpx;
		margin-top: 68rpx;
		background: #43ABC4;
		border-radius: 14rpx;
		color: #fff;
		line-height: 90rpx;
		font-size: 28rpx;
		text-align: center;
	}
</style> -->